<!--
 * @description  : 证件-死亡或丧失行为能力告知书
 * @descriptionDetail: 证件-死亡或丧失行为能力告知书
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2024-03-12 15:43:11
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :isWhite="true" backText="返回" title="文书信息">
      <view class="theme-color" @click="printOrDown(docIns.isRecorded)">
        {{ docIns.isRecorded ? "" : "打印" }}
      </view>
    </theme-navbar>
    <!-- #endif -->
		<!-- #ifdef H5-WECHAT || H5-EMP -->
		<fab-button :content="docIns.isRecorded ? [] :fContents" @fabtrigger="fabtrigger" />
		<!-- #endif -->
		
    <view class="main-content">
      <view class="main-title"> 告知书 </view>
      <u-form
        class="form-content"
        :model="docIns"
        :error-type="errorType"
        ref="uForm"
      >
        <u-form-item
          label="文书编号"
          :label-position="labelPosition"
          :required="true"
        >
          <u-input
            type="text"
            :clearable="false"
            :disabled="true"
            placeholder="请输入"
            v-model="docIns.fullDocNo"
          />
        </u-form-item>
        <u-form-item
          label="被告知人"
          :label-position="labelPosition"
          prop="managerNames"
          :required="true"
        >
          <u-input
            placeholder="请输入被告知人"
            :disabled="licParam.procStatus == '02'"
            v-model="docIns.managerNames"
          />
        </u-form-item>
        <u-form-item
          label="持证人"
          :label-position="labelPosition"
          prop="managerName"
          :required="true"
        >
          <u-input
            placeholder="请输入"
            :disabled="true"
            v-model="docIns.managerName"
          />
        </u-form-item>

        <u-form-item
          label="许可证号"
          :label-position="labelPosition"
          prop="licNo"
          :required="true"
        >
          <u-input
            placeholder="请输入许可证号"
            :disabled="true"
            v-model="docIns.licNo"
          />
        </u-form-item>
        <u-form-item
          label="经营地址"
          :label-position="labelPosition"
          prop="businessAddr"
          ref="dateChangeRef"
          :required="true"
        >
          <u-input
            placeholder="请输入经营地址"
            :disabled="true"
            v-model="docIns.businessAddr"
          />
        </u-form-item>
        <u-form-item
          label="死亡或丧失民事行为能力日期"
          :label-position="labelPosition"
          prop="deathDate"
          :required="true"
        >
          <u-input
            :disabled="true"
            placeholder="请选择日期"
            class="right-text"
            v-model="docIns.deathDate"
          />
        </u-form-item>
        <u-form-item
          label="变更申请机关"
          :label-position="labelPosition"
          prop="transOrgName"
          :required="true"
        >
          <u-input
            placeholder="请输入变更申请机关"
            :disabled="true"
            v-model="docIns.transOrgName"
          />
        </u-form-item>
        <u-form-item
          label="事项告知"
          :label-position="labelPosition"
          prop="talkItem"
        >
          <u-input
            placeholder="请输入"
            :disabled="true"
            type="textarea"
            v-model="talkItem"
          />
        </u-form-item>
        <u-form-item
          label-width="200"
          label="承办人签名"
          label-position="left"
          prop="undertakerName"
        >
          <view class="person-info">
            <view class="p-title">
              <view class="doc-sub-required"> * </view>
              <text class="p-width">
                {{ docIns.undertakerName }}
              </text>
              <view
                class="uicon-sty"
                @click="
                  () => {
                    licParam.procStatus != '02' && addPerson();
                  }
                "
              >
                <u-icon
                  name="plus-circle"
                  :color="$theme.u_type_primary"
                  size="40"
                ></u-icon>
              </view>
            </view>
          </view>
        </u-form-item>
        <u-form-item
          label="承办机关地址"
          :label-position="labelPosition"
          prop="transUnit"
          :required="true"
        >
          <u-input
            placeholder="请输入承办机关地址"
            :disabled="true"
            v-model="docIns.transUnit"
          />
        </u-form-item>
        <u-form-item
          label="承办机关电话"
          :label-position="labelPosition"
          prop="transUnitTel"
          :required="true"
        >
          <u-input
            placeholder="请输入承办机关电话"
            :disabled="true"
            v-model="docIns.transUnitTel"
          />
        </u-form-item>
        <u-form-item
          label="文书日期"
          :label-position="labelPosition"
          right-icon="arrow-right"
          prop="transDate"
        >
          <u-input
            :disabled="true"
            class="right-text"
            v-model="docIns.transDate"
            @click="
              () => {
                licParam.procStatus != '02' && (isShowDocDate = true);
              }
            "
          />
        </u-form-item>
        <u-form-item label="签收日期:" label-width="200">
          <u-input
             :disabled="true"
            placeholder="请输入签收日期"
            class="right-text"
            v-model="docIns.signTime"
          />
        </u-form-item>
        <u-form-item label="签收人:" label-width="200" ref="signPerson">
          <u-input
             :disabled="true"
            placeholder="请输入签收人"
            v-model="docIns.signPerson"
          />
        </u-form-item>
        <!-- <u-form-item label="说明" :label-position="labelPosition" prop="desc">
          <u-input
            placeholder="请输入"
             :disabled="licParam.procStatus == '02'"
            type="textarea"
            v-model="desc"
          />
        </u-form-item> -->
      </u-form>
      <view class="bottom-btn-info" v-if="licParam.procStatus != '02'">
        <u-row gutter="16">
          <u-col span="12">
            <u-button type="primary" @click="saveOrSubmit('submit')">
              提交
            </u-button>
          </u-col>
        </u-row>
      </view>
    </view>
    <u-calendar
      :mode="mode"
      :max-date="maxDate"
      v-model="isShowDocDate"
      @change="changeDate('docDate', $event)"
    >
    </u-calendar>
    <u-popup mode="bottom" height="80%" v-model="personSelectShow">
      <org-person-select @choose="handlerChoosePerson"></org-person-select>
    </u-popup>
  </view>
</template>
<script>
import { dateUtils } from "@/common/util";
import certificateService from "@/service/certificate/certificate.service.js";
import caseCommon from "@/pages/case/caseCommonMixin";
import OrgPersonSelect from "@/components/org-person-select.vue";
import fabButton from '@/components/uni-fab.vue';

import moment from "moment";
export default {
  components: { OrgPersonSelect,fabButton },
  mixins: [caseCommon],
  data() {
    return {
      mode: "date",
      maxDate: moment().format("YYYY-MM-DD"),
      personSelectShow: false,
      psParam: {
        min: 1,
        max: 2,
      },
      isShowRegDate: false,
      isShowDocDate: false,
      labelPosition: "top",
      labelWidth: "200",
      errorType: ["border-bottom", "message"],
      regsList: [], // 先保书列表
      isDisabled: true, // 表单禁用
      //       desc: `1.告知对象为备案的全体家庭成员。
      // 2.申请人应先完成营业执照变更手续。
      // 3.因持证人已死亡或丧失民事行为能力，无法提出线上申请，应通知家庭成员到窗口办理。
      // 4.实地核查时应注意核对死亡证明、家庭成员关系证明等相关证明材料。`,
      rules: {
        deathDate: [
          {
            required: true,
            message: "请选择死亡或丧失民事行为能力日期",
            trigger: ["change", "blur"],
          },
        ],
        managerNames: [
          {
            required: true,
            message: "请输入被告知人",
            trigger: ["change", "blur"],
          },
        ],
        undertakerName: [
          {
            required: true,
            message: "请输入承办人",
            trigger: ["change", "blur"],
          },
        ],
        licNo: [
          {
            required: true,
            message: "请输入许可证号",
            trigger: ["change", "blur"],
          },
        ],
        businessAddr: [
          {
            required: true,
            message: "请输入经营地址",
            trigger: ["change", "blur"],
          },
        ],
        transUnit: [
          {
            required: true,
            message: "请输入承办机关地址",
            trigger: ["change", "blur"],
          },

        ],
        docDate: [
          {
            required: true,
            message: "请选择文书日期",
            trigger: ["change", "blur"],
          },
        ],
        transUnitTel: [
          {
            required: true,
            message: "请填写承办机关电话",
            trigger: ["change", "blur"],
          },
        ],
        transDate: [
          {
            required: true,
            message: "请选择文书日期",
            trigger: ["change", "blur"],
          },
        ],
      },
      Param: {},
      docInsUuid: "",
      personList: [], // 承办人
      isAction: false,
      licParam: {}, // 文书列表中传过来的参数
      doc: {},
      docConfigs: {},
      licNo: "",
      docIns: {
        transOrgName: "",
        signPerson: "",
        signTime: "",
        isRecorded: false,
        undertakerName: "",
      }, // 表单数据
      saveData: {},
      isShowSignView: false,
      signImgList: [],
      btnType: "111",
			fContents: [{
				iconPath: require('@/static/dy.png'),
				selectedIconPath: require('@/static/dy.png'),
				text: '打印',
				active: false,
			}],
			
    };
  },
  computed: {
    talkItem() {
      let text = "";
      if (this.docIns.transOrgName) {
        text = `符合申领烟草专卖零售许可证主体资格条件的家庭成员可以于持证人死亡或丧失民事行为能力之日起90个自然日内，或收到本告知书30个自然日内，以上述期间截止日的先到日为期间届满标准，向${this.docIns.transOrgName}提出变更申请。上述期间届满，未申请变更持证人或变更申请未获许可的，本局将依法注销烟草专卖零售许可证。`;
      }
      return text;
    },
  },
  watch: {
    isShowDocDate() {
      this.$refs.dateChangeRef.validation();
    },
    isShowRegDate() {
      this.$refs.docDateChangeRef.validation();
    },
    isAction() {
      this.$refs.caseChangeRef.validation();
    },
  },

  created() {},
  onReady() {
    this.$refs.uForm.setRules(this.rules);
  },
  onLoad() {
    this.licParam = this.getRouteParam();
    console.log(this.licParam.procStatus, "procStatus");
  },
  mounted() {
    // this.docStep((docInfo) => {
    //   this.doc = docInfo ? docInfo : {};
    this.setRightBtns();
    // });
    this.getById();
  },
  methods: {
    // 设置右侧标题
    setRightBtns() {
      // #ifdef H5-DINGDING
      this.$deviceApi.setRight(
        !this.docIns.isRecorded ? "" : "打印",
        () => {
          this.printOrDown(this.licParam.procStatus != "02");
        },
        true,
        true
      );
      // #endif
    },
    getById() {
      this.$u.loading("正在加载数据...");
      certificateService
        .findByIdNotification({ id: this.licParam.bizUuid })
        .then((res) => {
          if (res.success) {
            this.$u.hideLoading();
            this.Param = res.bean;
            this.docIns = res.bean;
            this.docIns.isRecorded = false;
            this.initDocData();
          }
        });
    },

    // 初始化文书信息
    initDocData() {
      this.$u.loading("正在加载数据...");
      certificateService
        .getByCode({ docCode: "death_notification" })
        .then((res) => {
          if (res.success) {
            this.docConfigs = res.bean;
            let parms = {
              id: this.docConfigs.docUuid,
              licNo: this.licNo,
              followupMonitorWarnId: this.docConfigs.bizUuid,
            };
            certificateService.getDocOffical(parms).then((res) => {
              if (res.success) {
                this.$u.hideLoading();
              }
            });
          } else {
            this.$u.toast(res.msg);
          }
        })
        .catch((err) => {
          this.$u.hideLoading();
          this.$u.toast(err);
        });
    },
    addPerson() {
      this.psParam = {
        min: 1,
        max: 2,
      };
      this.personSelectShow = true;
    },
    handlerChoosePerson(psrList) {
      if (psrList.length > 2) {
        this.$u.toast("最多选择两个人");
        return;
      }
      let names = [];
      let ids = [];
      psrList.forEach((p) => {
        names.push(p.name);
        ids.push(p.id);
      });
      this.docIns["undertakerNameUuids"] = ids.join(",");
      this.docIns["undertakerName"] = names.join(",");
      this.$set(this.docIns, "undertakerName", names.join(","));
      this.personSelectShow = false;
    },

    changeDate(type, e) {
      this.docIns[type] = dateUtils.dateFormat(
        "yyyy年MM月dd日",
        new Date(e.result)
      );
      if (type == "docDate") this.$refs.docDateChangeRef.validation();
    },
    // 打印/预览
    printOrDown(flag) {
      if (flag) {
        // 调接口预览
        this.saveOrSubmit("preview");
      } else {
        this.downloadFile(this.docIns.pdfFileId);
      }
    },
    downloadFile(fileId, titleName, isDownload) {
      let pdfIds = fileId;
      if (!pdfIds) {
        this.$u.toast("请先保存文书,在已办结中打印文书");
        return;
      }
      this.setRouteParam({
        fileId: pdfIds,
        fileName: titleName,
        isDownload: isDownload,
      });
      this.$u.route("pages/commonPage/printerComponent");
    },

    // 保存或提交
    saveOrSubmit(type) {
      if (type == "preview") {
        console.log(this.docInsUuid, "pdfId");
        if (!this.docIns.isRecorded) {
          this.$u.toast("请先保存数据");
          return;
        }
        certificateService
          .buildLocalPunish("/licother/death-notification", this.docInsUuid)
          .then((pdfId) => {
            if (pdfId.success) {
              this.downloadFile(pdfId.bean, "", false);
            } else {
              this.$u.toast(pdfId.msg);
            }
          });
      } else if (type == "submit") {
        this.$refs.uForm.validate((valid) => {
          if (valid) {
            this.$u.loading("保存中...");
            const apParm = {
              docUuid: this.docConfigs.docUuid,
              gfaCode: "edit",
            };
            certificateService
              .saveDocnotification(this.docIns, apParm)
              .then((res) => {
                if (res.success && res.data.length > 0) {
                  this.$u.hideLoading();
                  this.docInsUuid = res.data[0].docInsUuid;
                  this.docIns["isRecorded"] = true;
                  this.submitDoc();
                }
              })
              .catch((err) => {
                this.$u.hideLoading();
                this.$u.toast(err);
              });
          }
        });
      }
    },
    submitDoc() {
      this.$u.loading("提交中...");
      const apParm = {
        docUuid: this.docConfigs.docUuid,
        gfaCode: "edit",
        docInsUuid: this.docInsUuid,
      };
      certificateService
        .submitDocnotification(this.docIns, apParm)
        .then((res) => {
          if (res.success) {
            this.$u.hideLoading();
            this.backPrev({
              paramKey: "refresh",
              param: true,
            });
            this.$u.toast("提交成功");
          }
        })
        .catch((err) => {
          this.$u.hideLoading();
          this.$u.toast(err);
        });
    },
		fabtrigger(btn) {
			if (btn.index == 0) {
				this.printOrDown(this.licParam.procStatus != "02");
			}
		},
  },
};
</script>

<style lang="scss" scoped>
// 表单样式
.main-content {
  margin: 0 15px 10px 15px;

  .main-title {
    font-size: 20px;
    margin: 20px 0 5px 0;
    text-align: center;
  }

  //表单文本内容居右显示
  .form-content {
    margin-bottom: 60px;
  }

  // 承办人样式
  .person-info {
    width: 100%;
    .p-title {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;

      .doc-sub-required {
        position: absolute;
        left: -8px;
        vertical-align: middle;
        color: #fa3534;
        padding-top: 3px;
      }
    }

    .p-content {
      .p-width {
        margin-right: 10px;
        display: inline-block;
      }

      .p-space-left {
        padding-left: 40px;
      }
    }
  }
}

.page {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;

  .content {
  }

  .content-padding {
    padding-left: 32rpx;
    padding-right: 32rpx;
  }

  .content-bg {
    background-color: $u-bg-color;
  }

  .slot-wrap {
    display: flex;
    align-items: center;
  }

  .navbar-right {
    margin-right: 24rpx;
    display: flex;
    color: $u-type-primary;
  }

  .right-item {
    margin: 0 12rpx;
    position: relative;
    color: $u-main-color;
    display: flex;
  }
}
.doc-no {
  display: inline-block;
  height: 35px;
  width: 60px;
  text-align: center !important;
  flex: none;
}

.check-desc {
  display: flex;
  align-items: center;

  .dec-input {
    width: 25%;
  }
}
.p-title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;

  .doc-sub-required {
    position: absolute;
    left: -8px;
    vertical-align: middle;
    color: #fa3534;
    padding-top: 3px;
  }
}
.uicon-sty {
  color: $u-type-primary;
  padding-left: 10px;
}
.theme-color {
  color: $u-type-primary;
  margin-right: 30rpx;
}
// 固定底部按钮
.bottom-btn-info {
  position: fixed;
  bottom: 5px;
  right: 0;
  left: 0;
  z-index: 999;
}
</style>
